import React from "react";
import "./index.scss";

const CouponsSkeleton = props => {
	const { children, load } = props;
	let initArr = ["", "", "", "", ""];
	if (load) {
		return children;
	}
	return (
		<ul className="coupons-skeleton">
			{initArr.map((v, i) => {
				return (
					<li key={`initArr${i}`}>
						<div className="coupons-skeleton-left"></div>
						<div className="coupons-skeleton-right">
							<div className="coupons-skeleton-right-top"></div>
							<div className="coupons-skeleton-right-middle">
								<span></span>
								<span></span>
							</div>
							<div className="coupons-skeleton-right-bottom"></div>
						</div>
						<div className="coupons-skeleton-last"></div>
					</li>
				);
			})}
		</ul>
	);
};
export default CouponsSkeleton;
